import { Button, Container, Form } from 'react-bootstrap'
import auth from '../store/auth'
import { MakeUserData } from '../dtos'

export function LoginPage() {
    return (
        <Container>
            <br />
            <Form>
                <Form.Group>
                    <Form.Label>Логин</Form.Label>
                    <Form.Control name='login' placeholder='Введите логин' defaultValue='perkov_aleksandr' id='login' />
                </Form.Group>
                <Form.Group>
                    <Form.Label>Пароль</Form.Label>
                    <Form.Control
                        name='password'
                        placeholder='Введите пароль'
                        defaultValue='V439-pYHeo'
                        type='password'
                        id='password'
                    />
                </Form.Group>
            </Form>
            <br />
            <Button
                variant='dark'
                onClick={() => {
                    auth.LogIn(
                        MakeUserData(
                            document.getElementById('login')?.value,
                            document.getElementById('password')?.value
                        )
                    )
                }}
            >
                Войти
            </Button>
        </Container>
    )
}
